<template>
	<view class="w-750 h-641 w-fixed-top w-bj-content w-column-align" v-if="show">
		<!-- 开奖时间 120-->
		<view class="w-700 h-120 w-row-justify-between-align">
			<view class="w-250 font-32b w-wz-cont w-column">
				<!-- <image class="w-140 h-50" src="../../../static/game_name/amjs.png" mode="aspectFill"></image> -->
				<text class="font-32b">俄罗斯28</text>
				<text class="font-26b w-wz-gree">{{room_name}}</text>
			</view>
			
			<view class="w-180 h-70 w-relative">
				<image class="w-180 h-70" src="../../../static/gane/the_countdown.png"></image>
				<view class="w-180 h-66 w-absolute-left w-wz-white w-row-center font-30b">
					<text v-if="title">{{title}}</text>
					<uni-countdown v-else :show-day="false" :show-hour="false" :font-size="17" :showColon="false"
						color="#ffffff" splitorColor="#ffffff" :minute="end_time.minute" :second="end_time.second || 0"
						@timeup="timeStop()">
					</uni-countdown>
				</view>
			</view>
			<view class="w-260 w-column-end-justify-around font-26b w-wz-black8">
				<text> <text class="w-wz-gree font-26b">第{{nextIssue}}</text></text>
				<text>结果时间 <text class="w-wz-gree font-26b">{{start_time}}</text></text>
			</view>
		</view>

		<!-- 开奖数字结果 180-->
		
		<view class="w-750 w-column-align" v-if="title">
			<view class="w-700">
				<view class="w-700 h-70 w-row-center">
					<text class="w-wz-white font-30b">第 <text class="w-wz-red">{{nextIssue}}</text> 正在出结果</text>
				</view>
			
				<view class="w-row-justify-center-align font-50b w-wz-white h-100">
			
					<view class="w-row-center">
						<view class="wh-80 w-bk-conts w-bor-12 w-bj-blacks w-column-align animatext">
							<text class="numbers">{{num1}}</text>
							<text class="numbers">{{num1}}</text>
							<text class="numbers">{{num1}}</text>
						</view>
						<text class="p-20 font-50 w-wz-conts">+</text>
					</view>
			
					<view class="w-row-center">
						<view class="wh-80 w-bk-conts w-bor-12 w-bj-blacks w-column-align animatext">
							<text class="numberst">{{num2}}</text>
							<text class="numberst">{{num2}}</text>
							<text class="numberst">{{num2}}</text>
						</view>
						<text class="p-20 font-50 w-wz-conts">+</text>
					</view>
			
					<view class="w-row-center">
						<view class="wh-80 w-bk-conts w-bor-12 w-bj-blacks w-column-align animatext">
							<text class="numbers">{{num3}}</text>
							<text class="numbers">{{num3}}</text>
							<text class="numbers">{{num3}}</text>
						</view>
						<text class="p-20 font-50 w-wz-conts">=</text>
					</view>
			
					<view class="wh-80 w-bk-conts w-bor-12 w-bj-blacks w-row-center">?</view>
				</view>
			</view>
			
			<view class="bwh-120 w-row-justify-center-align">
			
				<view class="w-row-center">
					<view class="w-100 h-60 w-relative">
						<image class="w-100 h-60" src="../../../static/gane/the_lottery.png"></image>
						<view class="w-100 h-56 w-absolute-left w-wz-white font-26b w-row-center">-</view>
					</view>
					<text class="font-32b w-wz-conts p-16 m-top-6">*</text>
				</view>
			
				<view class="w-row-center">
					<view class="w-100 h-60 w-relative">
						<image class="w-100 h-60" src="../../../static/gane/the_lottery.png"></image>
						<view class="w-100 h-56 w-absolute-left w-wz-white font-26b w-row-center">-</view>
					</view>
					<text class="font-32b w-wz-conts p-16 m-top-6">*</text>
				</view>
			
				<view class="w-row-center">
					<view class="w-100 h-60 w-relative">
						<image class="w-100 h-60" src="../../../static/gane/the_lottery.png"></image>
						<view class="w-100 h-56 w-absolute-left w-wz-white font-26b w-row-center">-</view>
					</view>
					<text class="font-32b w-wz-conts p-16 m-top-6">*</text>
				</view>
			
				<view class="w-row-center">
					<view class="w-100 h-60 w-relative">
						<image class="w-100 h-60" src="../../../static/gane/the_lottery.png"></image>
						<view class="w-100 h-56 w-absolute-left w-wz-white font-26b w-row-center">-</view>
					</view>
				</view>
				<text class="font-32b w-wz-conts p-16 m-top-6">*</text>
				<view class="w-row-center">
					<view class="w-100 h-60 w-relative">
						<image class="w-100 h-60" src="../../../static/gane/the_lottery.png"></image>
						<view class="w-100 h-56 w-absolute-left w-wz-white font-26b w-row-center">-</view>
					</view>
			
				</view>
			
			</view>
			
		</view>
		
		<view class="w-750 w-column-align"  v-else>
			<view class="w-700">
				<view class="w-700 h-70 w-row-center">
					<text class="w-wz-white font-30b">第 <text class="w-wz-red">{{issue}}</text> 结果</text>
				</view>
				<view class="w-row-justify-center-align font-50b w-wz-white h-100">
			
					<view v-for="(item,index) in betArray.bet_number">
						<view class="w-row-center">
							<view class="wh-80 w-bk-conts w-bor-12 w-bj-blacks w-row-center ">
								<text class="inner-container">{{item}}</text>
							</view>
							<text v-if="index == 2" class="p-20 font-50 w-wz-conts">=</text>
							<text v-else class="p-20 font-50 w-wz-conts">+</text>
						</view>
					</view>
					<view class="wh-80 w-bk-conts w-bor-12 w-bj-blacks w-row-center">{{betArray.bet_tema}}</view>
				</view>
			</view>
			
			<view class="bwh-120 w-row-justify-center-align">
			
				<view class="w-row-center" v-for="(item,index) in betArray.bet_name">
					<view class="w-100 h-60 w-relative">
						<image class="w-100 h-60" src="../../../static/gane/the_lottery.png"></image>
						<view class="w-100 h-56 w-absolute-left w-wz-white font-26b w-row-center">{{item}}</view>
					</view>
					<text v-if="index !== (betArray.bet_name.length-1)" class="font-32b w-wz-conts p-16 m-top-6">*</text>
				</view>
			
			</view>
			
		</view>
		
		<!-- 用户信息 220 -->
		<view class="w-750 h-220 w-column-align w-bj-cont w-relative">

			<view class="w-700 h-60 m-top-20 w-row-align">
				<view class="w-wz-blue w-bk-blues w-bor-12 p-zy16 font-26 w-row-center" @click="RouteIndex(6)">
					<text class="m-bottom-2">充值</text>
				</view>
				<text class="p-10"></text>
				<view class="w-wz-gree w-bk-grees w-bor-12 p-zy16 font-26 w-row-center" @click="RouteIndex(7)">
					<text class="m-bottom-2">提现</text>
				</view>
				<text class="p-10"></text>
				<text class="w-wz-red font-30">余额￥<text>{{amoney}}</text></text>
				<text class="p-10"></text>
				<view class="w-row-center w-wz-conts w-mauto" @click="gameRule()">
					<text class="font-30 m-right-6 m-bottom-4">规则</text>
					<image class="wh-30" src="../../../static/gane/yw.png"></image>
				</view>
			</view>

			<!-- 键盘处 -->
			<view class="w-700 h-120 w-row-justify-between-align w-relative">
				<input v-model="input_value" style="width: 420rpx; background-color: #f8f8f8; border: solid 6rpx #ccb581; font-size: 32rpx;" class="h-50 w-bor-12 p-6" @focus="getFocus" placeholder="请输入内容" @confirm="confirmValue" />
				<view class="send_btn" @click="confirmValue">发送</view>
				<view class="h-120 w-row-align" hover-class="pulse" @click="keyboardBet()">
					<image class="wh-90" src="../../../static/gane/jp.png"></image>
				</view>

				<view style="width: 150rpx; height: 72rpx; color: #272727; background-color: #ccb581; font-weight: 700;"
					class="w-bor-12 w-row-center" hover-class="pulse">
					<text class="m-bottom-2 font-32b" @click="quickBet()">快捷下单</text>
				</view>
			</view>

			<!-- 键盘 -->
			<view v-if="showKey" style="width: 750rpx; position: absolute; top: 220rpx; left: 0;">
				<view style="height: 60vh;" @click="closeShowKey()">
					<view style="border-radius: 0 0 25rpx 25rpx;" class="w-column-align w-bj-content" @click.stop="">
						<view class="h-10"></view>
						<view class="w-710 w-row-wrap-justify-between-align">
							<view v-for="val in keyval" class="skeyboard" @click="keyboardValue(val)">{{val}}</view>
							<view class="skeyboard" @click="keyboardValue('.')">&#x2022;</view>
							<view class="skeyboard" @click="keyboardValue(' ')">
								<image class="wh-55" src="../../../static/gane/kg.png"></image>
							</view>
							<view class="skeyboard" @click="deleteKeyboardValue()">
								<image class="wh-45" src="../../../static/gane/tg.png"></image>
							</view>

							<view class="skeyboard" style="color: #af0000;" @click="cancelForm">清空</view>
							<view class="skeyboard" style="color: #009445;" @click="defineForm">确定</view>
						</view>

						<view class="w-300 h-120 w-row-center w-wz-conts ">
							<view class="w-row-center w-200 h-80" @click.stop="betRule()">
								<text class="font-28 m-right-6 m-bottom-4">下单规则</text>
								<image class="wh-30" src="../../../static/gane/yw.png"></image>
							</view>
						</view>
					</view>
				</view>

			</view>


			<!-- 快捷 -->
			<view v-if="quicKey" style="width: 750rpx; position: absolute; top: 220rpx; left: 0;"
				class="w-column-align w-bj-content">
				<view class="h-30"></view>
				<view class="w-720  w-relative">
					<image class="w-720 h-120" src="../../../static/gane/game-tit.png"></image>
					<view class="w-720 h-120 w-absolute-left w-wz-white w-row-center font-32b">
						<view class="w-630 h-100 w-row-justify-evenly">
							<view class="w-120 h-70 w-row-center" :class="tabIndex == 1 ? 'tabbtn':''"
								hover-class="pulse" @click="tabindex(1)">猜和值</view>
							<view class="w-120 h-70 w-row-center" :class="tabIndex == 2 ? 'tabbtn':''"
								hover-class="pulse" @click="tabindex(2)">猜组合</view>
							<view class="w-120 h-70 w-row-center" :class="tabIndex == 3 ? 'tabbtn':''"
								hover-class="pulse" @click="tabindex(3)">猜极值</view>
							<view class="w-120 h-70 w-row-center" :class="tabIndex == 4 ? 'tabbtn':''"
								hover-class="pulse" @click="tabindex(4)">猜类型</view>
						</view>
					</view>
				</view>

				<!-- 猜和值 -->
				<view v-if="tabIndex == 1" style="width: 700rpx; height: 650rpx; overflow: scroll;">
					<view class="w-row-wrap-justify-center">
						<view class="wh-100 betbtn" v-for="(item,index) in gameData.room_odds.caihezhi.list"
							@click="chooseCaihezhi(item,index)" :class="{betbtns:item.checked==1}">
							<text class="font-36b">{{item.number}}</text>
							<text class="font-22" v-if="item.odds">x{{item.odds}}</text>
							<text class="font-22" v-else>x0</text>
						</view>
					</view>
					<view class="h-100 w-row-center">
						<image class="wh-50" src="../../../static/gane/jpgb.png" @click="closeQuicKey()"></image>
					</view>
					<view class="h-300"></view>
				</view>


				<!-- 猜组合 -->
				<view v-if="tabIndex == 2" style="width: 700rpx; height: 650rpx; overflow: scroll;">
					<view class="w-row-wrap-justify-center">
						<view class="w-280 h-100 betbtn" v-for="(item,index) in gameData.room_odds.caizuhe.list"
							@click="chooseCaizuhe(item,index)" :class="{betbtns:item.checked==1}" v-show="!['大','小','单','双'].includes(item.number)">
							<text class="font-36b">{{item.number}}</text>
							<text class="font-22" v-if="item.odds">x{{item.odds}}</text>
							<text class="font-22" v-else>x0</text>
						</view>
					</view>

					<view class="h-100 w-row-center">
						<image class="wh-50" src="../../../static/gane/jpgb.png" @click="closeQuicKey()"></image>
					</view>
					<view class="h-300"></view>
				</view>

				<!-- 猜极值 -->
				<view v-if="tabIndex == 3" style="width: 700rpx; height: 650rpx; overflow: scroll;">
					<view class="w-column-align">
						<view class="w-500 h-100 betbtn" v-for="(item,index) in gameData.room_odds.caijizhi.list"
							@click="chooseCaijizhi(item,index)" :class="{betbtns:item.checked==1}">
							<text class="font-36b">{{item.number}}</text>
							<text class="font-22" v-if="item.odds">x{{item.odds}}</text>
							<text class="font-22" v-else>x0</text>
						</view>
					</view>

					<view class="h-100 w-row-center">
						<image class="wh-50" src="../../../static/gane/jpgb.png" @click="closeQuicKey()"></image>
					</view>
					<view class="h-100"></view>

				</view>

				<!-- 猜类型 -->
				<view v-if="tabIndex == 4" style="width: 700rpx; height: 650rpx; overflow: scroll;">
					<view class="w-column-align">
						<view class="w-column-align">
							<view class="w-500 h-100 betbtn" v-for="(item,index) in gameData.room_odds.caileixing.list"
								@click="chooseCaileixing(item,index)" :class="{betbtns:item.checked==1}">
								<text class="font-36b">{{item.number}}</text>
								<text class="font-22" v-if="item.odds">x{{item.odds}}</text>
								<text class="font-22" v-else>x0</text>
							</view>
						</view>
					</view>

					<view class="h-100 w-row-center">
						<image class="wh-50" src="../../../static/gane/jpgb.png" @click="closeQuicKey()"></image>
					</view>
					<view class="h-100"></view>

				</view>
			</view>
		</view>

	</view>

	<view class="w-750 h-650"></view>

	<view v-if="show"
		style="display: flex; flex-direction: column; align-items: center; width: 120rpx; height: 500rpx; position: fixed; top: 650 rpx; left: 0;">
		<view class="tools m-bottom-20" @click="RouteIndex(1)">主页</view>
		<view class="tools m-bottom-20" @click="RouteIndex(2)">刷新</view>
		<view v-if="agent_code" class="tools m-bottom-20" @click="RouteIndex(3)">邀请</view>
		<view class="tools m-bottom-20" @click="RouteIndex(4)">订单</view>
		<view class="tools m-bottom-20" @click="RouteIndex(5)">走势</view>
	</view>
	
	<view class="msg_list" id="scroll-view-content">
		<view class="item" :class="{right: UserInfo.uid == item.uid}" v-for="(item,index) in pour_array">
			<view class="head">
				<image class="avatar" :src="item.headimgurl" v-if="item.headimgurl"></image>
				<image class="avatar" src="../../../static/gane/kefu.png" v-else></image>
				<view class="nickname">{{item.nickname}}</view>
				<view class="time">{{item.createtime_text}}</view>
				<view class="type w-wz-gree" v-if="item.type == '开始通知'"> [{{item.type}}] </view>
				<view class="type w-wz-red" v-else-if="item.type == '下单报表' || item.type == '结算报表' || item.type == '结束通知'"> [{{item.type}}] </view>
				<view class="type" v-else-if="item.type == '订单通知'"> </view>
				<view class="type" style="color: #ffaa00;" v-else> [{{item.type}}] </view>
			</view>
			<view class="msg" :class="{w_msg: item.type == '结算报表'}" v-html="item.msg"></view>
		</view>
	</view>

	<view v-if="pourData.length >=1" class="w-fixed-bottom w-750 h-100 w-bj-content w-bor-top w-row-center">
		<view class="w-row-align">
			<button size="mini" type="warn" @click="initArray()">清空</button>
			<view class="p-zy20 w-wz-conts font-30">共 {{pourData.length}} 单</view>
			<button size="mini" type="primary" @click="openPopup">确定</button>
		</view>
	</view>

	<uni-popup ref="popup" type="bottom">
		<view style="border-radius:25rpx 25rpx 0 0;" class="w-bj-cont w-column-align w-wz-conts">
			<view class="h-30"></view>
			<view class="w-720 h-80 w-wz-white w-row-justify-between-align w-bor-bottom font-30">
				<view class="w-130 w-row-center">类型</view>
				<view class="w-130 w-row-center">号码</view>
				<view class="w-130 w-row-center">赔率</view>
				<view class="w-150 w-row-center">金额</view>
				<view class="w-180 w-row-center">中奖(含本金)</view>
			</view>
			<view class="w-720 h-80 w-wz-conts w-row-justify-between-align w-bor-bottom font-28"
				v-for="item in pourData">
				<view class="w-130 w-row-center">{{name}}</view>
				<view class="w-130 w-row-center">{{item.number}}</view>
				<view class="w-130 w-row-center">x{{item.odds}}</view>
				<view class="w-150 w-row-center">￥{{money ? money : 0}}</view>
				<view class="w-180 w-row-center">￥{{ (item.odds*money) | currency}}</view>
			</view>

			<view class="w-680 h-80 w-wz-white w-row-justify-between-align font-28">
				<view class="w-100"></view>
				<text class="w-row-center w-wz-conts">第<text style="color: #45cf00;">{{Number(issue)+1}}</text> 共<text  style="color: #45cf00;">{{pourData.length}}</text>单 合计金额¥<text style="color: #45cf00; margin-left: 5rpx;">{{pourData.length*money}}</text> </text>
			</view>

			<view class="w-700 w-row-justify-around-align">
				<view class="w-500 h-100">
					<view class="wh-100 pour-info" hover-class="pulse" style="background-position: center -222rpx;"
						@click="pourMoney(50)">
					</view>
					<view class="wh-100 pour-info" hover-class="pulse" style="background-position: center -333rpx;"
						@click="pourMoney(100)">
					</view>
					<view class="wh-100 pour-info" hover-class="pulse" style="background-position: center -444rpx;"
						@click="pourMoney(500)">
					</view>
					<view class="wh-100 pour-info" hover-class="pulse" style="background-position: center -555rpx;"
						@click="pourMoney(1000)"></view>
					<view class="wh-100 pour-info" hover-class="pulse" style="background-position: center -666rpx;"
						@click="pourMoney(5000)"></view>
				</view>
				<view class="w-160">
					<input v-model="money" type="number" class="p-10 w-bk-conts w-bor-12 font-28" placeholder="自定金额"
						placeholder-class="w-wz-conts" />
				</view>
			</view>

			<view class="w-row-align h-150">
				<button size="mini" type="warn" @click="initArray()">清空订单</button>
				<text class="p-20"></text>
				<button size="mini" type="primary" :disabled="submitLock" @click="submitPour()">确定下单</button>
			</view>
		</view>

	</uni-popup>


	<!-- 键盘规则 -->
	<uni-popup ref="popupbet" type="center">
		<view class="w-450 w-bj-white w-bor-12 w-column-align p-30">
			<text class="w-wz-black3 font-32b">键盘下单规则</text>
			<view class="w-column w-360 font-28 m-top-10">
				<text><text>10号下单100</text><text> 规则：10.100</text></text>
				<text><text>大下单100</text><text> 规则：大.100</text></text>
				<text><text>单下单100</text><text> 规则：单.100</text></text>
				<text><text>极大下单100</text><text> 规则：极大.100</text></text>
				<text><text>大单下单100</text><text> 规则：大单.100</text></text>
				<text><text>豹子下单100</text><text> 规则：豹子.100</text></text>
				<text class="w-wz-red">下单以<text class="font-28b"> . </text>分割 点前面代表号码 点后面代表金额，以此类推...</text>
			</view>

			<view class="wh-50"></view>

		</view>
	</uni-popup>

	<!-- 规则 -->
	<uni-popup ref="popupgame" type="center">
		<view class="w-450 w-bj-white w-bor-12 w-column-align p-30">
			<text class="w-wz-black3 font-32b">规则如下</text>
			<rich-text :nodes="Config.app_xinjiapo_rich_text"></rich-text>
			<view class="wh-20"></view>
		</view>
	</uni-popup>




</template>

<script>
	import $H from '@/pages/common/request.js'
	export default {

		data() {
			return {
				keyval: ['0', '1', '2', '3', '4', '5', '6', '7', '8', '9', '大', '小', '单', '双', '大单', '小单', '大双', '小双',
					'极大', '极小', '豹子', '顺子', '对子'
				], //键盘值
				nextIssue: null,
				issue: null,
				tabIndex: 1, // tab索引
				showKey: false, //键盘
				quicKey: false, //快捷
				submitLock: false,
				input_value: '', //键盘下注
				input_list: [], //数据拼接,
				room_label: '', //房间标识
				gameData: null, //赔率数据
				pourData: [], //下注数据
				money: null, //下注金额
				money_min: null, //最小下注金额
				money_max: null, //最大下注金额
				name: '', // 下注名称
				amoney: 0,
				agent_code: null,
				end_time: {},
				betArray: {},
				start_time: null,
				title: null,
				UserInfo: {},
				stopTime: '',
				show: false,
				pour_array: [],
				room_name: null,
				Config: {},
				num1: 1,
				num2: 5,
				num3: 9,
				lastTime: '',
			}
		},

		filters: {
			currency(value) {
				return value.toFixed(2)
			}
		},
		onLoad(option) {

			this.unmTime()
			this.Config = uni.getStorageSync('Config');
			this.UserInfo = uni.getStorageSync('UserInfo');
			console.log(this.UserInfo.uid)
			const room_label = option.room_label;
			if (typeof room_label === 'undefined') {
				return uni.reLaunch({
					url: '/pages/index/index'
				});
			} else {
				this.room_label = room_label
				this.getRoomOdds(this.room_label)
				this.getIssueData()
				// this.AutoLoadTime()
			}

		},
		onShow() {
			this.AutoLoadTime()
		},

		onUnload() {
			clearInterval(this.timer)
			console.log('页面卸载')
		},

		onHide() {
			clearInterval(this.timer)
			console.log('页面隐藏')
		},

		methods: {

			unmTime() {
				setInterval(() => {
					this.num1 = Math.ceil(Math.random() * 10) - 1
					this.num2 = Math.ceil(Math.random() * 10) - 1
					this.num3 = Math.ceil(Math.random() * 10) - 1
				}, 800);
			},

			AutoLoadTime() {
				clearInterval(this.timer)
				this.timer = setInterval(() => {
					this.getIssueData()
				}, 5000);
			},

			// 获取开奖信息
			getIssueData() {

				$H.post('/app_xinjiapo_issue_data', {
					last_time: this.lastTime,
					room_label: this.room_label
				}).then((res) => {
					
					if (res.code == 200) {
						this.show = true
						this.title = res.data.title
						this.nextIssue = res.data.next_issue
						this.issue = res.data.issue
						this.number = res.data.number
						this.amoney = res.data.amoney
						this.end_time = res.data.end_time
						this.betArray = res.data.bet_array
						this.agent_code = res.data.agent_code
						this.start_time = res.data.start_time
						this.lastTime = res.data.last_time

						let pourArray = res.data.pour_array
						pourArray.forEach((value) => {
							if (this.pour_array.length == 0) {
								this.pour_array.push(value)
							}
							let result = this.pour_array.find(item => item.id == value.id)
							if (!result) {
								this.pour_array.push(value)
							}

						})

						this.scrollToBottom()
						this.stopTime = this.timestampToTime()

					} else {
						uni.reLaunch({
							url: '/pages/index/index'
						});
						return uni.showToast({
							title: res.msg,
							duration: 1000,
							icon: 'none'
						});
					}
				})
			},

			// 获取房间赔率
			getRoomOdds(room_label) {

				$H.post('/app_xinjiapo_room_odds', {
					room_label
				}).then((res) => {
				 console.log(res)
					if (res.code == 200) {
						if (res.data.room_odds) {
							this.gameData = res.data
							this.room_name = res.data.room_name
						}
					} else {
						return uni.showToast({
							title: res.msg,
							duration: 1000,
							icon: 'none'
						});
					}
				})
			},

			// 快捷投注
			submitPour(){
				if(this.submitLock) return
				if (Number(this.money) < Number(this.money_min)) {
					return uni.showToast({
						title: `下单金额不能小于${this.money_min}`,
						duration: 1000,
						icon: 'none'
					});
				}
				if (Number(this.money) > Number(this.money_max)) {
					return uni.showToast({
						title: `下单金额不能大于${this.money_max}`,
						duration: 1000,
						icon: 'none'
					});
				}
				let bet_array = []
				this.pourData.forEach((item) => {
					bet_array.push( {number: item.number, odds: item.odds, money: this.money} )
				})
				if(bet_array.length > 0) this.submitOrder(bet_array, 1)
			},

			// 键盘投注
			defineForm() {
				if(this.submitLock) return
				if (Number(this.end_time.second) < 0) {
					return uni.showToast({
						title: `${this.issue+1}结束中`,
						duration: 1000,
						icon: 'none'
					});
				}
				if (this.input_value == '') {
					return uni.showToast({
						title: '下单内容为空',
						duration: 1000,
						icon: 'none'
					});
				}
				let bet_list = this.input_value.split(" ")
				if(bet_list.length<=1){
					//判断是否非连着输入
					let arr = this.input_value.match(/([^\d]+\d+)/g)
					if(arr.length>=2) bet_list = arr
				}
				const num_list = ['0', '1', '2', '3', '4', '5', '6', '7', '8', '9', '10', '11', '12', 
				'13', '14', '15', '16', '17', '18', '19', '20', '21', '22', '23', '24', '25', '26', '27',
				'大', '小', '单', '双', '大单', '小单', '大双', '小双', '极大', '极小', '豹子', '顺子', '对子']
				
				let bet_array = []
				bet_list.forEach((value) => {
					if (value) {
						let number = null;
						let money = null;
						let bet_item = value.split(/[.操艹草]/)
						if (bet_item.length == 2) {
							number = bet_item[0];
							money = bet_item[1];
						}else{
							let bet_item = value.match(/(\D*)(\d*)/);
							if(bet_item.length == 3){
								number = bet_item[1];
								money = bet_item[2];
							}else{
								return uni.showToast({title: '下单规则错误', duration: 1000, icon: 'none'});
							}	
						}
						if (isNaN(Number(money))) return uni.showToast({title: '下单金额错误', duration: 1000, icon: 'none'})
						if (number.trim() == "" || number.trim() == null) return uni.showToast({title: '下单号码为空', duration: 1000, icon: 'none'})
						if (num_list.includes(number)) {
							bet_array.push( {number: number, money: money} )
						} else {
							return uni.showToast({title: '下单号码错误', duration: 1000, icon: 'none'})
						}
					}
				})
				if(bet_array.length > 0) this.submitOrder(bet_array, 2)
			},
			// 提交订单
			submitOrder(bet_array, type) {
				if(this.submitLock) return
                this.submitLock = true
				const formData = {
					bet_type: type,
					bet_array: bet_array,
					game_type: 'xinjiapo',
					room_label: this.room_label
				}
				console.log(bet_array)
				uni.showLoading({title: '下单中', mask: true});
				// 提交订单
				$H.post('/app_user_betpour', formData).then((res) => {
					uni.hideLoading();
					if (res.code == 200) {
						uni.showToast({
							title: res.msg,
							duration: 1000,
							icon: 'none'
						});
						setTimeout(() => {
							this.submitLock = false
							this.showKey = false
							this.initArray()
						}, 1000);

					} else {
						this.submitLock = false
						return uni.showToast({
							title: res.msg,
							duration: 1000,
							icon: 'none'
						});
					}
				})

			},

			// ----------------------------------------快捷下单-----------------------------------
			// 猜和值
			chooseCaihezhi(item, index) {
				this.selectBetdata(item, index, this.gameData.room_odds.caihezhi)
			},
			// 猜组合
			chooseCaizuhe(item, index) {
				this.selectBetdata(item, index, this.gameData.room_odds.caizuhe)
			},
			// 猜极值
			chooseCaijizhi(item, index) {
				this.selectBetdata(item, index, this.gameData.room_odds.caijizhi)
			},
			// 猜类型
			chooseCaileixing(item, index) {
				this.selectBetdata(item, index, this.gameData.room_odds.caileixing)
			},
			// 选择号码
			selectBetdata(data, index, typedata) {

				if (Number(this.end_time.second) < 0) {
					return uni.showToast({
						title: `${Number(this.issue)+1}结束中`,
						duration: 1000,
						icon: 'none'
					});
				}

				if (!data.odds) {
					return uni.showToast({
						title: '请先设置倍数',
						duration: 1000,
						icon: 'none'
					});
				}

				this.name = typedata.name
				this.money = typedata.money_min
				this.money_min = typedata.money_min
				this.money_max = typedata.money_max

				if (this.pourData.includes(data)) {
					this.pourData.forEach((value, key) => {
						if (value.number == data.number) {
							this.pourData.splice(key, 1);
							typedata.list[index].checked = 0
						}
					})
				} else {
					if (this.pourData.length >= 5) {
						return uni.showToast({
							title: '单次下单不能超过5单',
							duration: 1000,
							icon: 'none'
						});
					}
					this.pourData.push(data);
					typedata.list[index].checked = 1
				}

			},
			quickBet() {
				if (!this.gameData) {
					return uni.showToast({
						title: '请先设置倍数',
						duration: 1000,
						icon: 'none'
					});
				}
				this.quicKey = !this.quicKey
				this.showKey = false
				this.initArray()
			},
			tabindex(tabIndex) {
				this.tabIndex = tabIndex
				this.initArray()
			},
			// 初始化数据
			initArray() {
				this.pourData.forEach((v, k, a) => {
					a[k].checked = 0;
				})

				this.pourData = []
				this.input_value = ''
				this.input_list = []
				this.$refs.popup.close()
			},

			// 下注金额
			pourMoney(money) {
				let betMoney = parseInt(this.money)
				if(betMoney < money){
					this.money = money
				}else{
					this.money = money + betMoney
				}
			},

			// 关闭快捷
			closeQuicKey() {
				this.quicKey = false
				this.showKey = false
				this.initArray()
			},
			// 关闭键盘 
			closeShowKey() {
				this.showKey = false
				this.initArray()
			},

			// ----------------------------------------键盘下注-----------------------------------
			keyboardBet() {
				if (!this.gameData) {
					return uni.showToast({
						title: '请先设置倍数',
						duration: 1000,
						icon: 'none'
					});
				}
				this.showKey = !this.showKey
				this.quicKey = false
				this.initArray()
			},

			// 监听输入框
			getFocus() {
				this.quicKey = false
				this.showKey = false
				this.initArray()
			},
			// 初始数据
			cancelForm() {
				this.input_list = []
				this.input_value = ''
			},

			// 键盘确定
			confirmValue() {
				this.defineForm()
			},

			deleteKeyboardValue() {
				this.input_list.pop()
				this.input_value = this.input_list.join("")
			},

			// 输入框数据拼接
			keyboardValue(value) {
				this.input_list.push(value)
				this.input_value = this.input_list.join("")
			},

			// 弹出层
			openPopup() {
				this.$refs.popup.open('bottom')
			},

			gameRule() {
				this.$refs.popupgame.open('center')
			},

			betRule() {
				this.$refs.popupbet.open('center')
			},

			timeStop() {
				setTimeout(() => {
					this.title = '正在出结果...'
					// this.$router.go(0)
				},800);
			},

			RouteIndex(index) {

				if (index == 1) {
					uni.switchTab({
						url: '/pages/index/index'
					});
				}
				if (index == 2) {
					location.reload()
				}
				if (index == 3) {
					uni.navigateTo({
						url: '/pages/my/agent/agent'
					});
				}
				if (index == 4) {
					uni.navigateTo({
						url: '/pages/my/order/order'
					});
				}
				if (index == 5) {
					uni.navigateTo({
						url: '/pages/game/xinjiapo/redord'
					});
				}
				if (index == 6) {
					uni.navigateTo({
						url: '/pages/my/wallet/save_amoney'
					});
				}

				if (index == 7) {
					uni.navigateTo({
						url: '/pages/my/wallet/take_amoney'
					});
				}
			},

			scrollToBottom() {
				this.$nextTick(() => {
					uni.createSelectorQuery().select("#scroll-view-content").boundingClientRect(res => {
						uni.pageScrollTo({
							scrollTop: res.height,
							duration: 300
						});
					}).exec()
				})
			},

			timestampToTime() {
				let timestamp = Date.now()
				var date = new Date(timestamp);
				var Y = date.getFullYear() + '-';
				var M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-';
				var D = (date.getDate() < 10 ? '0' + date.getDate() : date.getDate()) + ' ';
				var h = (date.getHours() < 10 ? '0' + date.getHours() : date.getHours()) + ':';
				var m = (date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes()) + ':';
				var s = date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds();
				return Y + M + D + h + m + s;
			}

		}
	}
</script>

<style lang="less" scoped>
	.msg_list{
		margin: 0 0rpx 0 120rpx;
		padding: 20rpx 0;
		.item{
			color: #ccb581;
			display: flex;
			flex-direction: column;
			// align-items: flex-end;
			margin: 0 100rpx 20rpx 100rpx;
			.head{
				display: flex;
				font-size: 26rpx;
				position: relative;
				align-items: center;
				.avatar{
					border: 4rpx solid #ccb581;
					border-radius: 50%;
					width: 80rpx;
					height: 80rpx;
					position: absolute;
					top: 0rpx;
					left: -100rpx;
				}
				.nickname{
					margin-right: 10rpx;
				}
				.time{
					margin-right: 10rpx;
				}
				.type{
				}
			}
			.msg{
				width: 360rpx;
				font-size: 22rpx;
				background-color: #272727;
				padding: 20rpx;
				margin-top: 6rpx;
				border-radius: 12rpx;
			}
			.w_msg{
				background-color: #fff;
				color: #000;
			}
		}
		.right{
			margin-left: 60rpx;
			margin-right: 120rpx;
			align-items: flex-end;
			.head{
				flex-direction: row-reverse;
				.avatar{
					left: auto;
					right: -100rpx;
				}
				.nickname{
					margin-right: 10rpx;
				}
				.time{
					margin-right: 10rpx;
				}
				.type{
					margin-right: 10rpx;
				}
			}
			.msg{
			}
			.w_msg{
			}
		}
	}
	.send_btn{
		position: absolute;
		left: 364rpx;
		background-color: #b09c6f;
		color: #ffffff;
		font-size: 24rpx;
		padding: 10rpx 10rpx;
		border-radius: 10rpx;
	}
	.animatext {
		overflow: hidden;
	}

	.numbers {
		line-height: 80rpx;
	}

	.numbers:first-child {
		animation: anim 2.5s infinite;
	}

	@keyframes anim {
		0% {
			margin-top: 0rpx;
		}

		25% {
			margin-top: -80rpx;
		}

		50% {
			margin-top: -160rpx;
		}

		75% {
			margin-top: -80rpx;
		}

		100% {
			margin-top: 0rpx;
		}
	}

	.numberst {
		line-height: 80rpx;
	}

	.numberst:first-child {
		animation: anims 2.5s infinite;
	}

	@keyframes anims {
		0% {
			margin-top: -80rpx;
		}

		25% {
			margin-top: -160rpx;
		}

		50% {
			margin-top: -80rpx;
		}

		75% {
			margin-top: -160rpx;
		}

		100% {
			margin-top: -80rpx;
		}
	}

	.pour-info {
		width: 100rpx;
		height: 100rpx;
		display: inline-block;
		background: url("../../../static/gane/chouma.png") no-repeat center top/ 100rpx auto;
	}

	.skeyboard {
		width: 80rpx;
		height: 70rpx;
		margin: 6rpx;
		margin-top: 20rpx;
		display: flex;
		justify-content: center;
		align-items: center;
		background-color: #ccb581;
		font-size: 32rpx;
		font-weight: 700;
		border-radius: 12rpx;
		color: #4a4a4a;
		box-shadow: 0 10rpx #8a7856;
	}

	.skeyboard:hover {
		background-color: #ccb581
	}

	.skeyboard:active {
		background-color: #b09c6f;
		box-shadow: 0 3px #666;
		transform: translateY(2px);
	}


	.tools {
		width: 83rpx;
		height: 80rpx;
		display: flex;
		justify-content: center;
		align-items: center;
		background-color: #ccb581;
		font-size: 26rpx;
		font-weight: 700;
		border-radius: 100rpx;
		color: #4a4a4a;
		box-shadow: 0 10rpx #8a7856;
	}

	.tools:hover {
		background-color: #ccb581
	}

	.tools:active {
		background-color: #b09c6f;
		box-shadow: 0 3px #666;
		transform: translateY(2px);
	}


	.tabbtn {
		color: #444444;
		background-color: #ccb581;
		border-radius: 12rpx;
		border: solid 3rpx #ffffff;
	}

	/* 下注 */
	.betbtn {
		margin: 8rpx;
		border: solid 3rpx #ebebeb;
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		background-color: #ccb581;
		border-radius: 12rpx;
		color: #444444;
	}

	.betbtns {
		color: #ffffff;
		background-color: #d32a3d;
	}
</style>
